<template>
  <bs-dialog v-model="visible" :title="title" :width="800" :confirm-btn-fn="handleConfirm">
    <div class="dialog-content">
      <div class="info">
        <el-alert title="确认告警级别和状态,标注告警可能原因" type="info" show-icon :closable="false" />
      </div>
      <!--表单项-->
      <bs-form :model="formData" :grid="1" :label-width="90">
        <bs-form-item label="问题">
          <div class="text-content">B3.RD.MG.AS.G19A(10.254.22.30)---Interface GigabitEthernet1/0/7(GigabitEthernet1/0/7 Interface): High error rate (> 5000 for 5m),5分钟错包数量:2147483648</div>
        </bs-form-item>
        <bs-form-item label="更改严重性">
          <el-radio-group v-model="formData.a">
            <el-radio-button label="未分配" value="0" />
            <el-radio-button label="信息" value="1" />
            <el-radio-button label="警告" value="2" />
            <el-radio-button label="严重" value="3" />
          </el-radio-group>
        </bs-form-item>
        <bs-form-item label="关闭问题">
          <el-switch v-model="formData.b"></el-switch>
        </bs-form-item>
        <bs-form-item label="备注">
          <div>
            至少需要一个更新内容或消息<br>
            告警推荐原因,请填写并标注可能几率,原因推荐<br>
            预测可能原因: 暂无相关推荐原因请确认该原因或填写可能原因
          </div>
        </bs-form-item>
        <bs-form-item label="可能原因">
          <bs-input type="textarea" v-model="formData.c"></bs-input>
        </bs-form-item>
      </bs-form>
    </div>
  </bs-dialog>
</template>
<script setup lang="ts">
import {ref} from 'vue'
const title = '更新问题告警确认'
const visible = ref()
const formData = ref<Record<string, any>>({})
const info = ref()

/**
 * 确认更新
 */
const handleConfirm = () => {
}

const open = (item: any) => {
  visible.value = true
  info.value = item
}

defineExpose({
  open
})

</script>
<style lang="scss" scoped>
.info {
  margin-bottom: 16px;
}
</style>